<%@ page language="java" import="java.util.*" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="s"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>后台车场管理</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/aaa.css">
<script src="${pageContext.request.contextPath}/js/jquery-3.1.0.min.js"></script>
<script src="${pageContext.request.contextPath}/js/bootstrap.min.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=BK1nKL02Lul9X8RURxIvqGhORqsGigsB"></script>
<style type="text/css">
#l-map {
	height: 500px;
	width: 100%;
}
#r-result {
	width: 60%;
}
.mymodal {
	width: 60%;
}
</style>
</head>

<body>
<img calss="img-responsive" width="100%" src="${pageContext.request.contextPath}/image/head.jpg" />
<div class="container-fluid">
  <div class="row">
    <div class="span12">
      <nav class="navbar navbar-inverse" role="navigation">
        <div class="container-fluid"> 
          <!-- Brand and toggle get grouped for better mobile display -->
          <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
            <a class="navbar-brand" href="#">后台管理</a> </div>
          
          <!-- Collect the nav links, forms, and other content for toggling -->
          <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
              <li><a href="${ pageContext.request.contextPath }/adminExpress_findByPageAll.action?page=1">订单管理</a></li>
              <li><a href="${ pageContext.request.contextPath }/adminExpress_findAllFromAddr.action">今日揽件路径规划</a></li>
              <li><a href="${ pageContext.request.contextPath }/adminExpress_findAllToAddr.action">今日派送路径规划</a></li>
              <li  class="active"><a href="#">车场管理</a></li>
            </ul>
            <ul class="nav navbar-nav navbar-right">
              <li><a href="${ pageContext.request.contextPath }/adminLogin_loginOut.action">注销</a></li>
              <li>
                <h4><span class="label label-success">日期</span></h4>
              </li>
            </ul>
          </div>
          <!-- /.navbar-collapse --> 
        </div>
        <!-- /.container-fluid --> 
      </nav>
      <div class="panel-body">
        <table class="table table-condensed">
          <thead>
            <tr>
              <th>车场编号</th>
              <th>经度</th>
              <th>纬度</th>
              <th>状态</th>
              <th> <button class="btn btn-success" data-toggle="modal" data-target="#myModal">增加车场</button>
              </th>
            </tr>
          </thead>
          <tbody>
          	<s:iterator var="p" value="list">
            <tr>
              <td><s:property value="#p.pId"/></td>
              <td><s:property value="#p.pLNG"/></td>
              <td><s:property value="#p.pLAT"/></td>
              <td><s:if test="#p.state==0">未启用</s:if><s:if test="#p.state==1">启用</s:if></td>
              <td>
              <a href="${ pageContext.request.contextPath }/adminPort_updatePort.action?pId=<s:property value="#p.pId"/>" class="btn btn-warning btn-xs" ><s:if test="#p.state==0">启用车场</s:if><s:if test="#p.state==1">禁用车场</s:if></a>
              <a href="${ pageContext.request.contextPath }/adminPort_deletePort.action?pId=<s:property value="#p.pId"/>" class="btn btn-danger btn-xs">删除车场</a></td>
              <iframe id="tmp_downloadhelper_iframe" style="display: none;"></iframe>
            </tr>
            </s:iterator>
          </tbody>
        </table>
      </div>
      <br>
      <br>
    </div>
  </div>
</div>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog mymodal">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <h4 class="modal-title" id="myModalLabel">增加车场</h4>
      </div>
      <div class="modal-body">
        <div class="modal-body"> <br>
          地址：
          <input type="text" id="suggestId" value="" style="width:60%;">
          <br>
          <div id="l-map"> </div>
        </div>
      </div>
      <div class="modal-footer">
        <form method="get" action="${ pageContext.request.contextPath }/adminPort_addPort.action">
          <input type="hidden" id="pLNG" name="pLNG">
          <input type="hidden" id="pLAT" name="pLAT">
          <input type="submit" value="添加车场" class="btn btn-success">
          <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
        </form>
      </div>
    </div>
  </div>
</div>
<div class="btn-toolbar col-lg-4 col-lg-offset-4" role="toolbar">
  <div class="btn-group">...</div>
  <div class="btn-group">...</div>
  <div class="btn-group">...</div>
</div>
</body>
</html>
<script type="text/javascript">
	$('#myModal').on('shown.bs.modal', function () {
  	// 执行一些动作...
	init();
	})
	function init() {
		var map = new BMap.Map("l-map");
		var point = new BMap.Point(113.275995, 23.117055);
		map.centerAndZoom(point,12);                   // 初始化地图,设置城市和地图级别。
		map.enableScrollWheelZoom();
		var ppmarker = new BMap.Marker(point);
		ppmarker.setAnimation(BMAP_ANIMATION_BOUNCE);
		map.addOverlay(ppmarker);    //添加标注
		ppmarker.enableDragging();
		var geoc = new BMap.Geocoder();  
		ppmarker.addEventListener("dragend",overlay_style);
		geoc.getLocation(ppmarker.point, function(rs){
			var addComp = rs.addressComponents;
			document.getElementById("suggestId").value=
			addComp.province + addComp.city  + addComp.district  + addComp.street + addComp.streetNumber;
			});
		$("#pLNG").val(ppmarker.point.lng);
		$("#pLAT").val(ppmarker.point.lat);                //启用滚轮放大缩小
		function overlay_style(e){
				  var p = e.target.point;
				  geoc.getLocation(p, function(rs){
				  var addComp = rs.addressComponents;
				  document.getElementById("suggestId").value=
				  addComp.province + addComp.city  + addComp.district  + addComp.street + addComp.streetNumber;
				  $("#pLNG").val(p.lng);
				  $("#pLAT").val(p.lat);
			});
		 }
		
	}  	
</script>